import React, { createContext, Dispatch, SetStateAction, useState } from "react"

interface IAppStateValue {
	name: string
	age: number
}

const defaultContextValue: IAppStateValue = {
	name: "Felix",
	age: 18,
}

export const appContext = createContext({
	state: defaultContextValue,
	setState: undefined as Dispatch<SetStateAction<IAppStateValue>> | undefined,
})

const AppStateProvider: React.FC = props => {
	const [state, setState] = useState(defaultContextValue)
	return (
		<appContext.Provider
			value={{
				state,
				setState,
			}}
		>
			{props.children}
		</appContext.Provider>
	)
}

export default AppStateProvider
